<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <button>下一页数据</button>
  <script>
    // 需求：触发某个行为，等待一段时间后才能拿到数据！
    //       在等待这一段时间（冷却时间）再次触发，不能有效果！阻止！
    let num = 1
    let btn = document.querySelector('button')
    let key
    btn.addEventListener('click', function (params) {
      if (key === true) {
        return
      }

      key = true   //'进行中'
      num++

      // 模拟：从前端 发出请求到 后台 （从前端飞出鸽子，到了后台拿到数据，飞回到！）延时定时器
      setTimeout(function (params) {
        console.log(`请求第${num}页数据回来~~~`);
        key = false //'结束了'   
      }, 3000)
    })


  </script>
</body>

</html>